import 'package:flutter/material.dart';
import 'package:flutter_changdian_football/pages/mine/my_purse/my_purse_controller.dart';
import 'package:flutter_changdian_football/pages/mine/my_purse/recharge/recharge_controller.dart';
import 'package:flutter_changdian_football/utils/custom_constant.dart';
import 'package:flutter_changdian_football/utils/number_input_limit.dart';
import 'package:flutter_changdian_football/widget/custom_button.dart';
import 'package:flutter_changdian_football/widget/screenutil/custom_screenutil.dart';
import 'package:get/get.dart';

/// 充值
class RechargePage extends StatelessWidget {
  const RechargePage({
    super.key,
    this.type = CustomConstant.recharge_normal,
    this.clubId
  });

  // 充值类型 finance-财政  normal-普通
  final String type;

  final String? clubId;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: const Color(0xffF8FAF9),
      resizeToAvoidBottomInset: false,
      body: GetBuilder<MyPurseController>(
        builder: (myPurseController) {
          return GetBuilder<RechargeController>(
            init: RechargeController(clubId: clubId),
            builder: (rechargeController) {
              return Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Stack(
                    children: [
                      Stack(
                        clipBehavior: Clip.none,
                        alignment: Alignment.center,
                        children: [
                          Column(
                            mainAxisSize: MainAxisSize.min,
                            children: [
                              SizedBox(
                                width: double.infinity,
                                height: 240.w,
                                child: Image.asset(
                                  'assets/images/img_me_bg.png',
                                  width: double.infinity,
                                  height: 240.w,
                                  fit: BoxFit.fill,
                                ),
                              ),

                              SizedBox(height: 72.w,)
                            ],
                          ),

                          Positioned(
                            bottom: 0.w,
                            child: SizedBox(
                              child: Column(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  SizedBox(
                                    child: Row(
                                      crossAxisAlignment: CrossAxisAlignment.end,
                                      children: [
                                        Container(
                                          padding: EdgeInsets.only(bottom: 4.w),
                                          child: Text('我的金额(￥)', style: TextStyle(fontSize: 12.sp, color: Colors.white),),
                                        ),
                                        SizedBox(width: 10.w,),
                                        SizedBox(
                                          child: Text(myPurseController.userAccountBalance, style: TextStyle(fontSize: 26.sp, color: Colors.white, fontWeight: FontWeight.w500),),
                                        ),
                                      ],
                                    ),
                                  ),
                                  SizedBox(height: 20.w,),
                                  Container(
                                    decoration: BoxDecoration(
                                      color: Colors.white,
                                      borderRadius: BorderRadius.circular(16.r)
                                    ),
                                    width: MediaQuery.of(context).size.width - 34.w,
                                    padding: EdgeInsets.all(20.w),
                                    child: Column(
                                      mainAxisSize: MainAxisSize.min,
                                      crossAxisAlignment: CrossAxisAlignment.start,
                                      children: [
                                        Container(
                                          alignment: Alignment.centerLeft,
                                          child: Text('充值数额', style: TextStyle(fontSize: 16.sp, fontWeight: FontWeight.w500, color: const Color(0xff333333)),),
                                        ),
                                  
                                        SizedBox(height: 16.w,),
                                  
                                        SizedBox(
                                          child: Row(
                                            children: [
                                              Expanded(
                                                child: _itemMoneyButton(text: '20元', isSelect: rechargeController.selectCzSeIndex == 0, onTap: () {
                                                  rechargeController.changeCzSeIndex(0);
                                                }),
                                              ),
                                              SizedBox(width: 6.w,),
                                              Expanded(
                                                child: _itemMoneyButton(text: '50元', isSelect: rechargeController.selectCzSeIndex == 1, onTap: () {
                                                  rechargeController.changeCzSeIndex(1);
                                                }),
                                              ),
                                              SizedBox(width: 6.w,),
                                              Expanded(
                                                child: _itemMoneyButton(text: '100元', isSelect: rechargeController.selectCzSeIndex == 2, onTap: () {
                                                  rechargeController.changeCzSeIndex(2);
                                                }),
                                              )
                                            ],
                                          ),
                                        ),

                                        SizedBox(height: 16.w,),

                                        SizedBox(
                                          child: Row(
                                            children: [
                                              Expanded(
                                                child: rechargeController.selectCzSeIndex == 3 ? Container(
                                                  height: 40.w,
                                                  decoration: BoxDecoration(
                                                    color: const Color(0xff499360),
                                                    borderRadius: BorderRadius.circular(4.r)
                                                  ),
                                                  child: Row(
                                                    children: [
                                                      Expanded(
                                                        child: TextField(
                                                          autofocus: true,
                                                          textAlign: TextAlign.center,
                                                          keyboardType: TextInputType.number,
                                                          inputFormatters: [
                                                            NumberInputLimit(
                                                              digit: 2,
                                                              max: 9999999
                                                            )
                                                          ],
                                                          style: TextStyle(fontSize: 16.sp, color: Colors.white, fontWeight: FontWeight.w500),
                                                          cursorColor: Colors.white,
                                                          controller: rechargeController.rechargeBalanceController,
                                                          decoration: InputDecoration(
                                                            isCollapsed: true,
                                                            hintText: '',
                                                            hintStyle: TextStyle(fontSize: 16.sp, color: Colors.white, fontWeight: FontWeight.w500),
                                                            counterText: "",
                                                            contentPadding: EdgeInsets.symmetric(vertical: 0.w),
                                                            border: InputBorder.none,
                                                          ),
                                                        ),
                                                      )
                                                    ],
                                                  ),
                                                ) : _itemMoneyButton(text: '其他金额', isSelect: rechargeController.selectCzSeIndex == 3, onTap: () {
                                                  rechargeController.changeCzSeIndex(3);
                                                }),
                                                // child: Container(
                                                //   height: 40.w,
                                                //   decoration: BoxDecoration(
                                                //     color: const Color(0xff499360),
                                                //     borderRadius: BorderRadius.circular(4.r)
                                                //   ),
                                                //   child: Row(
                                                //     children: [
                                                //       Expanded(
                                                //         child: TextField(
                                                //           textAlign: TextAlign.center,
                                                //           style: TextStyle(fontSize: 16.sp, color: Colors.white, fontWeight: FontWeight.w500),
                                                //           cursorColor: Colors.white,
                                                //           decoration: InputDecoration(
                                                //             isCollapsed: true,
                                                //             hintText: '',
                                                //             hintStyle: TextStyle(fontSize: 16.sp, color: Colors.white, fontWeight: FontWeight.w500),
                                                //             counterText: "",
                                                //             contentPadding: EdgeInsets.symmetric(vertical: 0.w),
                                                //             border: InputBorder.none,
                                                //           ),
                                                //         ),
                                                //       )
                                                //     ],
                                                  // ),
                                                // ),
                                              ),
                                              SizedBox(width: 6.w,),
                                              Expanded(
                                                child: const SizedBox(),
                                              ),
                                              SizedBox(width: 6.w,),
                                              Expanded(
                                                child: const SizedBox(),
                                              )
                                            ],
                                          ),
                                        ),
                                      ],
                                    ),
                                  )
                                ],
                              ),
                            )
                          )
                        ],
                      ),

                      Positioned(
                        top: 0,
                        left: 0,
                        right: 0,
                        child: PreferredSize(
                          preferredSize: const Size.fromHeight(kToolbarHeight), 
                          child: AppBar(
                            elevation: 0, 
                            backgroundColor: const Color(0xffF8FAF9).withOpacity(0),
                            iconTheme: const IconThemeData(
                              color: Colors.white
                            ),
                            title: Text('充值', style: TextStyle(fontSize: 16.sp, color: Colors.white),),
                            centerTitle: true,
                          ),
                        ),
                      )
                    ],
                  ),

                  SizedBox(height: 26.w,),

                  Container(
                    padding: EdgeInsets.symmetric(horizontal: 37.w),
                    child: Text('支付方式', style: TextStyle(fontSize: 16.sp, color: const Color(0xff333333), fontWeight: FontWeight.w500),),
                  ),

                  SizedBox(height: 12.w,),

                  Container(
                    padding: EdgeInsets.symmetric(horizontal: 17.w),
                    child: Container(
                      padding: EdgeInsets.symmetric(vertical: 10.w, horizontal: 20.w),
                      decoration: BoxDecoration(
                        color: Colors.white,
                        borderRadius: BorderRadius.circular(12.r)
                      ),
                      child: Row(
                        children: [
                          Container(
                            width: 36.w,
                            height: 36.w,
                            decoration: BoxDecoration(
                              borderRadius: BorderRadius.circular(8.r)
                            ),
                            child: Image.asset('assets/images/img_zfb.png'),
                          ),

                          SizedBox(width: 8.w,),

                          SizedBox(
                            child: Text('支付宝支付', style: TextStyle(fontSize: 15.sp, color: const Color(0xff333333)),),
                          ),

                          const Spacer(),

                          Container(
                            width: 16.w,
                            height: 16.w,
                            child: Image.asset('assets/images/selected.png'),
                          )
                        ],
                      ),
                    ),
                  ),

                  const Spacer(),

                  Container(
                    padding: EdgeInsets.all(17.w),
                    child: CustomButton(
                      text: '立即充值',
                      onTap: () {
                        rechargeController.rechargeNow(type);
                      },
                    ),
                  ),

                  Container(
                    padding: EdgeInsets.only(left: 17.w, right: 17.w,  bottom: 20.w),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text('温馨提示', style: TextStyle(fontSize: 14.sp, color: const Color(0xff999999 )),),
                        SizedBox(height: 8.w,),

                        SizedBox(
                          child: Text('''1、只有俱乐部主席和财务才有俱乐部资金充值和提取权限。
2、俱乐部资金流水受全俱乐部成员监管，请合理管理俱乐部资金。
3、俱乐部资金无法转账给他人。
4、充值时请仔细核对金额了解使用场景，避免发生误操作。
5、充值金额到帐可能会因网络或数据处理原因产生一定延迟，请耐心等待。若长时间未到账，请主动与客服联系。
6、请您妥善保管好您的帐户，不要将帐户信息透露给其他人，避免应账户泄露导致俱乐部的资金损失。
7、俱乐部资金用于俱乐部活动集体开支，请妥善保管，不得私自挪作他用。非法转移集体资金将受到法律制裁''', style: TextStyle(fontSize: 12.sp, color: const Color(0xff999999), height: 1.5),),
                        )
                      ],
                    )
                  )
                ],
              );
            }
          );
        }
      ),
    );
  }


  _itemMoneyButton({
    String text = '',
    bool isSelect = false,
    Function? onTap
  }) {
    return GestureDetector(
      behavior: HitTestBehavior.translucent,
      onTap: () {
        onTap?.call();
      },
      child: Container(
        height: 40.w,
        decoration: BoxDecoration(
          color: isSelect ? const Color(0xff499360) : const Color(0xff499360).withOpacity(0.1),
          borderRadius: BorderRadius.circular(4.r)
        ),
        alignment: Alignment.center,
        child: Text(text, style: TextStyle(fontSize: 16.sp, fontWeight: FontWeight.w500, color: isSelect ? Colors.white : const Color(0xff499360)),),
      ),
    );
  }

}